<!DOCTYPE html>
<html>
	<head>
        <title>Screen Capture</title>
        <meta charset="utf-8">
        <meta name="copyright" content="www.juximao.com"/>
        <link href="css/showimage.css" rel="stylesheet" type="text/css">
        <script src="js/utils.js"></script>
        <script src="js/editor.js"></script>
        <script src="js/account.js"></script>
        <script src="js/huaban.js"></script>
        <script src="js/ui.js"></script>
        <script src="js/upload_ui.js"></script>
        <script src="js/ajax.js"></script>
    </head>
    <body>
          <header id="header">
          <div id="toolbar" class="toolbar">
           <ul>
            <li id="btnHighlight" class="mark">
            <div class="colorBox" id="highlightColorBox"></div>
            <span id="tHighlight">Highlight</span>
                <div class="tool" id="highlightTool">
                <div id="highlightColorPad"></div>
                <div class="clear"></div>
                <div class="tool-option" style="border-top: 1px solid #ccc; padding-top:2px; margin-top:5px;">
                  <div id="borderMode"><span id="border"></span></div>
                  <div id="rectMode"><span id="rect"></span></div>
                </div>
                <div class="tool-option-line">
                  <div id="rectangle" class="mark"><span class="rect"></span></div>
                  <div id="radiusRectangle"><span class="radiusRect"></span></div>
                  <div id="ellipse"><span class="ellipse"></span></div>
                </div>
              </div>
            </li>
            <li id="btnBlackout">
              <div class="blurBox" id="blackoutBox"></div>
              <span id="tRedact">Redact</span>
              <div class="tool tool-option">
                <div id="redact" class="mark"><span id="redactText"></span></div>
                <div id="blur" ><span id="blurText"></span></div>
              </div>
            </li>
            <li id="btnText">
            <div class="textBox" id="fontColorBox">A</div>
            <span id="tText">Text</span>
            <div class="tool" id="fontTool">
              <div id="fontColorPad"></div>
              <div class="clear"></div>
              <div class="tool-option" style="border-top: 1px solid #ccc; padding:2px 0 0 0; margin-top:5px">
               <div id="size_10" style="font-size: 10px"></div>
               <div id="size_16" style="font-size: 16px"></div>
               <div id="size_18" style="font-size: 18px"></div>
               <div id="size_32" class="mark" style="font-size: 32px"></div>
             </div>
            </div>
            </li>
            <li id="btnLine">
              <canvas id="lineIconCav" width="14" height="14" ></canvas>
              <span id="lineText"></span>
              <div class="tool">
               <div id="lineColorPad"></div>
               <div class="clear"></div>
               <div class="tool-option-line">
                 <div id="straightLine"><img src="/images/editor/line.png" alt=""> </div>
                 <div id="arrow"><img src="/images/editor/arrow.png" alt=""> </div>
               </div>
              </div>
            </li>
          </ul>
          </div>
          <div id="tip"></div>
          <div class="toolbar" id="okBtn" style="position:fixed; right:30px; top:0px;">
            <ul>
              <li id="btnSave">
                <img src="/images/editor/icon_save.png" alt="">
                <span id="tSave"></span>
              </li>
              <li id="btnUpload">
                <img src="/images/editor/pin.png" alt="">
                <span id="tUpload"></span>
              </li>
              <li id="btnClose">
                <img src="/images/editor/icon_close.png" alt="">
                <span id="tClose">Close</span>
              </li>
            </ul>

            <div id="savePanel">
                <div id="saveImg" class="img"></div>
                <div id="saveDesc" class="desc"></div>
                <div id="closeSavePanel"></div>
            </div>
          </div>
          <div class="clear"></div>
          </header>
        <div id="showBox">
            <div id="photo">
                <canvas id="canvas"></canvas>
                <canvas id="mask-canvas"></canvas>
                <div class="layer" id="layer0"></div>
            </div>

            <div id="pinWrapper" style="display:none;">
                <div id="bookmarklet">
                    <div class="form">
                        <div class="header lg">
                            <a href="javascript:;" class="close"><strong>Close</strong><span></span></a>
                            <h2>采集到聚喜猫</h2>
                            <div id="userIcon">
                            </div>
                        </div>
                        <div class="pbt">
                            <div class="ImagePicker">
                                <img src="images/load.gif" alt="Loading Indicator" class="load" style="display:none" />
                                <div class="Images pin carousel-container">
                                    <div class="carousel-clip">
                                        <ul class="carousel-list" style="width: 170px: left: 0px;">
                                            <li></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="pin-form">
                                <div class="BoardListOverlay"></div>
                                <div class="BoardSelector BoardPicker">
                                    <div class="current">
                                        <span class="CurrentBoard">选择画板...</span>
                                        <span class="DownArrow"></span>
                                    </div>
                                    <div class="BoardList">
                                        <div class="BoardListBody">
                                            <ul></ul>
                                        </div>
                                        <div class="CreateBoard">
                                            <input type="text" id="board_name_input" placeholder="创建新画板"/>
                                            <a href="javascript:;" class="nf btn btn18 wbtn disabled"><strong>创建</strong><span></span></a>
                                            <div class="CreateBoardStatus"></div>
                                        </div>
                                    </div>
                                </div>
                                <div class="InputArea">
                                    <ul class="Form FancyForm">
                                        <li class="nmb">
                                            <textarea name="caption" id="description" cols="30" rows="2" class="DescriptionTextarea"></textarea>
                                            <input type="hidden" id="url" />
                                            <label for="" style="display: none;">描述一下这个采集…</label>
                                            <span class="fff"></span>
                                        </li>
                                    </ul>
                                </div>
                                <div class="CreateBoardStatus error mainerror"></div>
                                <div class="Buttons">
                                    <a href="javascript:;" class="btn btn18 rbtn"><strong>采下来</strong><span></span></a>
                                    <label for="" class="weibo less">
                                        <input type="checkbox" class="publish_to_weibo" />
                                        <span>分享给微博粉丝</span>
                                    </label>
                                </div>
                            </div>

                            <div id="loading">
                                <div class="desc">正在获取授权...</div>
                                <div class="authorising"></div>
                            </div>

                            <div id="authorization">
                                <div class="desc">
                                    请在聚喜猫网上授权
                                </div>
                                <a href="javascript:;" class="btn btn18 rbtn" id="auth_btn"><strong>获取授权</strong><span></span></a>
                            </div>
                        </div>

                        <div id="pin-done" class="pin-done">
                            <h3>你已经成功采集到聚喜猫<a href="" target="_blank" class="less"></a></h3>
                            <div id="pin_operations">
                                <a id="view_pin" href="">查看这个采集</a>
                                <a id="close_window" href="javascript:;">关闭窗口</a>
                            </div>
                            <ul>
                            	<li>
                            		<a id="share_sinaweibo" class="share-button btn btn18 wbtn" href="javascript:;"><strong>分享到新浪微博</strong><span></span></a>
                            	</li>
                            	<li>
                            		<a id="share_douban" class="share-button btn btn18 wbtn" href="javascript:;"><strong>分享到豆瓣</strong><span></span></a>
                            	</li>
                            	<li>
                            		<a id="share_qzone" class="share-button btn btn18 wbtn" href="javascript:;"><strong>分享到QQ空间</strong><span></span></a>
                            	</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="overlay"></div>
        <div id="msgBar">
            <div class="msgWrapper"><div id="msg" class="msgInner"></div></div>
        </div>
        <script src="js/showimage.js"></script>
        <script src="js/ps.js"></script>
    </body>
</html>
